<script setup>
import { inject, ref, onMounted } from "vue";
import { getProductByKey } from "@/api/product";
import { countClick } from "@/api/article.js";

const getAssetsFile = inject("getAssetsFile");

import { useRoute } from "vue-router";
const route = useRoute();

const content = ref([]);
const filelist = ref([]);
const getData = async () => {
	const id = route.query.id;
	const res = await getProductByKey({ id });
	if (res.data.code === 200) {
		content.value = res.data.data.content;
		filelist.value = res.data.data.attachFiles;
	}
};

onMounted(() => {
	getData();
	const id = route.query.id;
	countClick({ id });
});
</script>

<template>
	<div class="pageContent">
		<n-space align="center" justify="space-between" style="margin-bottom: 20px">
			<n-h6 class="pageTitle" prefix="bar">
				<div>产品详情</div>
			</n-h6>
		</n-space>
		<n-divider class="pageDivider"></n-divider>
		<div class="ql-snow">
			<div class="content ql-editor" v-html="content"></div>
		</div>
		<div>
			<div>附件：</div>
			<div v-for="(item, index) in filelist" :key="index" @click="toload(item.accessUrl)" style="cursor: pointer; color: #4d79ff">
				{{ item.originalName }}
			</div>
		</div>
	</div>
</template>

<style scoped></style>
